<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
        <meta name="format-detection" content="telephone=no" />
        <title>商家首页</title>
        <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
        <link rel="stylesheet" type="text/css" href="../../css/common.css" />
        <style>
            body{
                background: #f3f3f3;
                font-size: 14px;
            }
            .myType{
                font-size: 12px;
            }
            .myType li{
                text-align: center;
                padding:4px 8px;
                float: left;
                margin:10px 8px;
                border:1px #c8c7cc solid;
                border-radius: 4px;
                background: #f3f3f3;
            }
            .mt15{
                margin-top:15px;
            }
            .aui-list-view:after{
                border:none;
            }
            .aui-arrow-right:after{
                top:22px;
            }
            .myPicker{
                position: fixed;
                top: 0px;
                /*-webkit-transform: translateY(100%);*/
                right: 0;
                overflow:hidden; 
                -webkit-transition:  1s;
                transition:  1s;
                width: 0;
                height: 0;
                color:#000;
                text-align: left;
                font-size: 14px;
                z-index: 9999;
            }
            .pickAnimate{
                /*-webkit-transform: translateY(-100px);*/
                width: 100%;
                height: 90px;
            }
            .myPicker .aui-iconfont {
                color:#000 !important;
                font-size: 20px !important;
            }
            .myPicker .aui-list-view-cell{
                overflow: hidden;
                padding:5px 2px;
            }
            .myPicker .aui-list-view i.aui-iconfont{
                margin-right: 2px;
            }
            .myPicker .aui-list-view{
                background: #f3f3f3;
            }
            .myPicker .aui-list-view:after{
                top: 97%;
            }
            .categoryChild li{
                background: #f3f3f3;
                width: 49%;
                float: left;
                padding:15px 0;
                text-align: center;
                margin-top: 8px;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space:nowrap;
            }
            .categoryChild li:ntH-of-type(2n+1){
                margin-right:2%;
            }
        </style>
    </head>
    <body>
        <div class="aui-content contain">

            <ul class="aui-list-view mt15">
                <li class="aui-list-view-cell">
                    <div class="aui-arrow-right aui-ellipsis-1">
                    全部商品
                    </div>
                </li>
            </ul>
            <ul class="aui-list-view">
                <li class="aui-list-view-cell">
                    <div class="aui-arrow-right aui-ellipsis-1">
                    爆款推荐
                    </div>
                    <ul class="categoryChild">
                        <li>这个是二级分类这个是二级分类这个是二级分类</li>
                        <li>这个是二级分类</li>
                        <li>这个是二级分类</li>
                    </ul>
                </li>
                <li class="aui-list-view-cell">
                    <div class="aui-arrow-right aui-ellipsis-1">
                    新品上架
                    </div>
                    <ul class="categoryChild">
                        <li>这个是二级分类这个是二级分类这个是二级分类</li>
                        <li>这个是二级分类</li>
                        <li>这个是二级分类</li>
                    </ul>
                </li>
                <li class="aui-list-view-cell">
                    <div class="aui-arrow-right aui-ellipsis-1">
                    新品上架
                    </div>
                </li>
            </ul>
        </div>
        <!-- 这个弹出的 -->

        <div class="myPicker">
            <ul class="aui-list-view">
                <li class="aui-list-view-cell">
                    <!-- 新消息通过控制newMeg样式 -->
                     <i class="aui-iconfont aui-icon-comment newMeg"></i><span>我的消息 </span>
                </li>
                <li class="aui-list-view-cell">
                     <i class="aui-iconfont aui-icon-home"></i><span>首页</span>
                </li>
            </ul>
        </div>
    </body>
    <script type="text/javascript" src="../../script/api.js" ></script>
    <script type="text/javascript" src="../../script/doT.min.js"></script>
    <script type="text/javascript" src="../../script/echo.js"></script>
    <script type="text/javascript" src="../../script/common.js"></script>
    <script type="text/javascript" src="../../script/myInfo.js"></script>
    <script type="text/javascript" src="../../script/jquery-1.11.3.js"></script>
    <script type="text/javascript" src="../../script/mui.js"></script>
    <script type="text/javascript">
        apiready = function() {
            api.parseTapmode();
            // getData();
            // api.setRefreshHeaderInfo({
            //     visible : true,
            //     loadingImg : 'widget://image/ptr_pull.png',
            //     bgColor : '#efeff4',
            //     textColor : '#959595',
            //     textDown : '下拉刷新',
            //     textUp : '松开刷新',
            //     showTime : true
            // }, function(ret, err) {
            //     page = 1;
            //     //getData();
            //     api.refreshHeaderLoadDone();
            // });
            //重新登录监听
            api.addEventListener({
                name : 'reGetMyInfo'
            }, function(ret) {
                if (ret && ret.value) {
                    page = 1;
                    getData();
                }
            });
        }
        
        //来自win的执行显示遮罩方法
        var mask2;
        function showMask(){
            mask2=new mui.createMask(closeWinMask);
            mask2.show();
            $(".myPicker").addClass("pickAnimate");
        }
        // 接收来自win的关闭遮罩
        function hideFrmMask(){
            $(".myPicker").removeClass("pickAnimate");
            mask2.myclose();
        }
        function closeWinMask(){
            $(".myPicker").removeClass("pickAnimate");
            api.execScript({
                name: 'myType_win',
                script: 'closeWinMask()'
            })
        }
    </script>
</html>